﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Template.Master" Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<div id="page-heading">
         <a class="icons icon-circle-arrow-right"></a> <b><span class="show-listing"> <%=ViewData["HeadingMsgStep5"].ToString()%></span> </b>
    </div>
    <div class="menu-nav">
         <% Html.RenderPartial("TopMenu");%>
    </div>
     <!-- end page-heading -->
    <table border="0" width="100%" cellpadding="0" cellspacing="0" id="content-table">
        <tr>
            <th rowspan="3" class="sized">
                <img src="<%=Url.Content("~/Content/images/shared/side_shadowleft.jpg")%>" width="20"
                    height="300" alt="" />
            </th>
            <th class="topleft">
            </th>
            <td id="tbl-border-top">
                &nbsp;
            </td>
            <th class="topright">
            </th>
            <th rowspan="3" class="sized">
                <img src="<%=Url.Content("~/Content/images/shared/side_shadowright.jpg")%>" width="20"
                    height="300" alt="" />
            </th>
        </tr>
        <tr>
            <td id="tbl-border-left">
            </td>
            <td>
                <!--  start content-table-inner ...................................................................... START -->
                <div id="content-table-inner">
                     <!--  start message-blue -->
                         <% Html.RenderPartial("Measage");%>     
                          <!--  end message-blue -->
  <!--  start step-holder -->
   <%Html.RenderPartial("StepHolder", (ViewData["ListingID"] != null) ? ViewData["ListingID"].ToString() : null); %>
    <!--  end step-holder -->
   <%Html.RenderPartial("UploadPhoto", ViewData["ImageList"] as IList<JLL.China.Model.ListingMedia>);%>
   <input type="button" style="margin-right:38px;" value="Next"    class="buttons" onclick="javascript:window.location.href='<%=Url.Content("~/")%><%=ViewData["now_controller"]%>Step6/<%= ViewData["ListingID"].ToString()%>'" />
                </div>
                <!--  end table-content  -->
                 </td>
            <td id="tbl-border-right">
            </td>
        </tr>
        <tr>
            <th class="sized bottomleft">
            </th>
            <td id="tbl-border-bottom">
                &nbsp;
            </td>
            <th class="sized bottomright">
            </th>
        </tr>
    </table>
</asp:Content>
 

<asp:Content ID="Content2" ContentPlaceHolderID="CSS" runat="server">

 <link href="<%=Url.Content("~/Scripts/uploadify/uploadify.css") %>" rel="stylesheet" type="text/css" />
 
 <link href="<%=Url.Content("~/Scripts/qtip2/jquery.qtip.min.css") %>" rel="stylesheet" type="text/css" />

 
 <link href="<%=Url.Content("~/Content/css/mod-listing.css") %>" rel="stylesheet" type="text/css" />
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="JS" runat="server">

 <script src="<%=Url.Content("~/Scripts/knockout/knockout.js")%>" type="text/javascript"></script>

 <script src="<%=Url.Content("~/Scripts/knockout/knockout.mapping.js")%>" type="text/javascript"></script>

 <script src="<%=Url.Content("~/Scripts/qtip2/jquery.qtip.min.js")%>" type="text/javascript"></script>
<script type="text/javascript" src="<%= Url.Content("~/Scripts/uploadify/swfobject.js") %>"></script>
<script type="text/javascript" src="<%= Url.Content("~/Scripts/uploadify/jquery.uploadify.min.js")  %>"></script>
<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery.dragsort.js")  %>"></script>
 <script type="text/javascript" src="<%= Url.Content("~/Scripts/Run.js")  %>"></script>

<script type='text/javascript'>
    $(document).ready(function() {
        //
          var totalImg  = <%=ViewData["TotalPhoto"]%>;
          var limitUpload = (10 - totalImg) ;
         
        //  
        $("#list1, #list2").dragsort({ dragSelector: "div", dragBetween: true, dragEnd: saveOrder, placeHolderTemplate: "<li class='placeHolder'><div></div></li>" });

        function saveOrder() {
            var data = $("#list1 li").map(function() { return $(this).children().html(); }).get();
            var data1 = $("#list1 li").map(function() { return $(this).data("itemid"); }).get();

           alert(data1);
        };
        
         function saveOrder() {
             $("#content-outer").showLoading();
                var data = $("#list1 li").map(function() { return $(this).data("itemid"); }).get();
                
                $.ajax({
                    url: '<%=Url.Content("~/")+ViewData["now_controller"]%>SaveOrder/' + data,

                    success: function(result) {
                        if(result=="OK") {
                            $("#content-outer").hideLoading();
                            jSuccess(
		                                '<div class="msgnotify"><b>Update order successfully</b></div>',
		                                {
		                                    autoHide: true, // added in v2.0
		                                    HorizontalPosition: 'center',
		                                    VerticalPosition: 'top'
		                                });   
                        }
                    }
                });
            };
        
        //fancy box
        $(".fancybox-button").fancybox({
            prevEffect: 'none',
            nextEffect: 'none',
            closeBtn: false,
            helpers: {
                title: null,
                buttons: {}
            }
        });
        //qtip
        $('a[title]').qtip();
        //
        $.ajaxSetup({ cache: false });
        var folderId = <%=ViewData["ListingID"].ToString()%>;
        //OTHER IMAGE
        $("#upload-photo").uploadify({
            auto: false,
            swf: '<%= Url.Content("~/")%>Scripts/uploadify/uploadify.swf',
            uploader: '<%= Url.Content("~/")%>UploadImages.ashx',
            formData: { 'folderId': folderId,'imageType':'Other Images', 'folder': '<%=ViewData["Module"]%>' },
            cancelImg: '<%= Url.Content("~/")%>Scripts/uploadify/uploadify-cancel.png',
            scriptAccess: 'always',
            buttonText: 'Browse',
            uploadLimit: limitUpload,
            fileSizeLimit: '2MB',
            fileTypeDesc: 'Image Files',
            fileTypeExts: '*.gif; *.jpg; *.png',
            multi: true,
            'onError': function(a, b, c, d) {
                if (d.status == 404)
                    alert('Could not find upload script.');
                else if (d.type === "HTTP")
                    alert('error ' + d.type + ": " + d.status);
                else if (d.type === "File Size")
                    alert(c.name + ' ' + d.type + ' Limit: ' + Math.round(d.sizeLimit / 1024) + 'KB');
                else
                    alert('error ' + d.type + ": " + d.text);
            },
            'onUploadComplete' : function(file, data){
                 $("#content-outer").hideLoading();
            },
            'onQueueComplete': function(queueData) {
                $("#content-outer").hideLoading();
                window.location.href = window.location.href;
            },
            'onSelect': function(file) {
                $('#upload-others-btn').removeClass('hide');
            },
            'onUploadStart': function(file) {
                $("#content-outer").showLoading();
            },
            'onCancel' : function(file) {
               $('#upload-others-btn').addClass('hide');
            } 
        });
        //1 MAIN  PHOTO
         $("#upload-image-main").uploadify({
            auto: false,
            swf: '<%= Url.Content("~/")%>Scripts/uploadify/uploadify.swf',
            uploader: '<%= Url.Content("~/")%>UploadImages.ashx',
            formData: { 'folderId': folderId,'imageType':'Cover image (Main)', 'folder': '<%=ViewData["Module"]%>' },
            cancelImg: '<%= Url.Content("~/")%>Scripts/uploadify/uploadify-cancel.png',
            scriptAccess: 'always',
            buttonText: 'Browse',
            uploadLimit: 1,
            fileSizeLimit: '2MB',
            fileTypeDesc: 'Image Files',
            fileTypeExts: '*.gif; *.jpg; *.png',
            multi: true,
            'onError': function(a, b, c, d) {
                if (d.status == 404)
                    alert('Could not find upload script.');
                else if (d.type === "HTTP")
                    alert('error ' + d.type + ": " + d.status);
                else if (d.type === "File Size")
                    alert(c.name + ' ' + d.type + ' Limit: ' + Math.round(d.sizeLimit / 1024) + 'KB');
                else
                    alert('error ' + d.type + ": " + d.text);
            },
            'onUploadComplete' : function(file, data){
                 $("#content-outer").hideLoading();
            },
            'onQueueComplete': function(queueData) {
                $("#content-outer").hideLoading();
                window.location.href = window.location.href;
            },
            'onSelect': function(file) {
                $('#btn-upload-image-main').removeClass('hide');
            },
            'onUploadStart': function(file) {
                $("#content-outer").showLoading();
            },
            'onCancel' : function(file) {
                $('#btn-upload-image-main').addClass('hide');
            } 
        });
        //end
         //2 SITEMAP
         $("#sitemap").uploadify({
            auto: false,
            swf: '<%= Url.Content("~/")%>Scripts/uploadify/uploadify.swf',
            uploader: '<%= Url.Content("~/")%>UploadImages.ashx',
            formData: { 'folderId': folderId,'imageType':'Site map', 'folder': '<%=ViewData["Module"]%>' },
            cancelImg: '<%= Url.Content("~/")%>Scripts/uploadify/uploadify-cancel.png',
            scriptAccess: 'always',
            buttonText: 'Browse',
            uploadLimit: 1,
            fileSizeLimit: '2MB',
            fileTypeDesc: 'Image Files',
            fileTypeExts: '*.gif; *.jpg; *.png',
            multi: true,
            'onError': function(a, b, c, d) {
                if (d.status == 404)
                    alert('Could not find upload script.');
                else if (d.type === "HTTP")
                    alert('error ' + d.type + ": " + d.status);
                else if (d.type === "File Size")
                    alert(c.name + ' ' + d.type + ' Limit: ' + Math.round(d.sizeLimit / 1024) + 'KB');
                else
                    alert('error ' + d.type + ": " + d.text);
            },
            'onUploadComplete' : function(file, data){
                 $("#content-outer").hideLoading();
            },
            'onQueueComplete': function(queueData) {
                $("#content-outer").hideLoading();
                window.location.href = window.location.href;
            },
            'onSelect': function(file) {
                $('#btn-upload-sitemap').removeClass('hide');
            },
            'onUploadStart': function(file) {
                $("#content-outer").showLoading();
            },
            'onCancel' : function(file) {
                 $('#btn-upload-sitemap').addClass('hide');
            } 
        });
        //end
        //3 AMENTIES IMAGE
         $("#amenties").uploadify({
            auto: false,
            swf: '<%= Url.Content("~/")%>Scripts/uploadify/uploadify.swf',
            uploader: '<%= Url.Content("~/")%>UploadImages.ashx',
            formData: { 'folderId': folderId, 'imageType':'Amenties','folder': '<%=ViewData["Module"]%>' },
            cancelImg: '<%= Url.Content("~/")%>Scripts/uploadify/uploadify-cancel.png',
            scriptAccess: 'always',
            buttonText: 'Browse',
            uploadLimit: 1,
            fileSizeLimit: '2MB',
            fileTypeDesc: 'Image Files',
            fileTypeExts: '*.gif; *.jpg; *.png',
            multi: true,
            'onError': function(a, b, c, d) {
                if (d.status == 404)
                    alert('Could not find upload script.');
                else if (d.type === "HTTP")
                    alert('error ' + d.type + ": " + d.status);
                else if (d.type === "File Size")
                    alert(c.name + ' ' + d.type + ' Limit: ' + Math.round(d.sizeLimit / 1024) + 'KB');
                else
                    alert('error ' + d.type + ": " + d.text);
            },
            'onUploadComplete' : function(file, data){
                 $("#content-outer").hideLoading();
            },
            'onQueueComplete': function(queueData) {
                $("#content-outer").hideLoading();
                window.location.href = window.location.href;
            },
            'onSelect': function(file) {
                $('#upload-amenties-btn').removeClass('hide');
            },
            'onUploadStart': function(file) {
                $("#content-outer").showLoading();
            },
            'onCancel':function(){
                $('#upload-amenties-btn').addClass('hide');
            }
        });
        //end
        //4 FACILITIES IMAGE
         $("#facilities").uploadify({
            auto: false,
            swf: '<%= Url.Content("~/")%>Scripts/uploadify/uploadify.swf',
            uploader: '<%= Url.Content("~/")%>UploadImages.ashx',
            formData: { 'folderId': folderId, 'imageType':'Facilities','folder': '<%=ViewData["Module"]%>' },
            cancelImg: '<%= Url.Content("~/")%>Scripts/uploadify/uploadify-cancel.png',
            scriptAccess: 'always',
            buttonText: 'Browse',
            uploadLimit: 1,
            fileSizeLimit: '2MB',
            fileTypeDesc: 'Image Files',
            fileTypeExts: '*.gif; *.jpg; *.png',
            multi: true,
            'onError': function(a, b, c, d) {
                if (d.status == 404)
                    alert('Could not find upload script.');
                else if (d.type === "HTTP")
                    alert('error ' + d.type + ": " + d.status);
                else if (d.type === "File Size")
                    alert(c.name + ' ' + d.type + ' Limit: ' + Math.round(d.sizeLimit / 1024) + 'KB');
                else
                    alert('error ' + d.type + ": " + d.text);
            },
            'onUploadComplete' : function(file, data){
                 $("#content-outer").hideLoading();
            },
            'onQueueComplete': function(queueData) {
                $("#content-outer").hideLoading();
                window.location.href = window.location.href;
            },
            'onSelect': function(file) {
                $('#upload-facilities-btn').removeClass('hide');
            },
            'onUploadStart': function(file) {
                $("#content-outer").showLoading();
            },
            'onCancel':function(){
                $('#upload-facilities-btn').addClass('hide');
            }
        });
        //end
        //5 SURROINDING
         $("#surrounding").uploadify({
            auto: false,
            swf: '<%= Url.Content("~/")%>Scripts/uploadify/uploadify.swf',
            uploader: '<%= Url.Content("~/")%>UploadImages.ashx',
            formData: { 'folderId': folderId, 'imageType':'Surrounding','folder': '<%=ViewData["Module"]%>' },
            cancelImg: '<%= Url.Content("~/")%>Scripts/uploadify/uploadify-cancel.png',
            scriptAccess: 'always',
            buttonText: 'Browse',
            uploadLimit: 1,
            fileSizeLimit: '2MB',
            fileTypeDesc: 'Image Files',
            fileTypeExts: '*.gif; *.jpg; *.png',
            multi: true,
            'onError': function(a, b, c, d) {
                if (d.status == 404)
                    alert('Could not find upload script.');
                else if (d.type === "HTTP")
                    alert('error ' + d.type + ": " + d.status);
                else if (d.type === "File Size")
                    alert(c.name + ' ' + d.type + ' Limit: ' + Math.round(d.sizeLimit / 1024) + 'KB');
                else
                    alert('error ' + d.type + ": " + d.text);
            },
            'onUploadComplete' : function(file, data){
                 $("#content-outer").hideLoading();
            },
            'onQueueComplete': function(queueData) {
                $("#content-outer").hideLoading();
                window.location.href = window.location.href;
            },
            'onSelect': function(file) {
                $('#upload-surrounding-btn').removeClass('hide');
            },
            'onUploadStart': function(file) {
                $("#content-outer").showLoading();
            },
            'onCancel':function(){
                $('#upload-surrounding-btn').addClass('hide');
            }
        });
        //end
         function Confirm(question, callback) {
        // Content will consist of the question and ok/cancel buttons
        var message = $('<p />', { text: question }),
			             cancel = $('<button />', {
			                 text: 'Yes',
			                 click: function() { callback(true); }
			             }),
			            ok = $('<button />', {
			                text: 'No',
			                click: function() { callback(false); }
			            })
			           ;

			            dialogue(message.add(ok).add(cancel), 'Confirm');
    }
        function dialogue(content, title) {
            /* 
            * Since the dialogue isn't really a tooltip as such, we'll use a dummy
            * out-of-DOM element as our target instead of an actual element like document.body
            */
            $('<div />').qtip(
		        {
		            content: {
		                text: content,
		                title: title
		            },
		            position: {
		                my: 'center', at: 'center', // Center it...
		                target: $(window) // ... in the window
		            },
		            show: {
		                ready: true, // Show it straight away
		                modal: {
		                    on: true, // Make it modal (darken the rest of the page)...
		                    blur: false // ... but don't close the tooltip when clicked
		                }
		            },
		            hide: false, // We'll hide it maunally so disable hide events
		            style: 'qtip-light qtip-rounded qtip-dialogue', // Add a few styles
		            events: {
		                // Hide the tooltip when any buttons in the dialogue are clicked
		                render: function(event, api) {
		                    $('button', api.elements.content).click(api.hide);
		                },
		                // Destroy the tooltip once it's hidden as we no longer need it!
		                hide: function(event, api) { api.destroy(); }
		            }
		        });
        }
        //ajax do   
        //Begin
        $('.tools .removelink').live('click', function(event) {
            var self = this;
            event.preventDefault();
            Confirm("Confirm removed the selected records?", function(yes) {
            if (yes) {
                    $("#content-outer").showLoading();
                    var pageurl = $(self).attr('href');
                     window.location.href = pageurl;
                  
                }

            });

        });
        //End
        //Begin
        $('.defaultlink').live('click', function(event) {
           
            $("#content-outer").showLoading();
           
        });
        //End
        //Begin
        $('.statuslink').live('click', function(event) {
            //event.preventDefault();
            $("#content-outer").showLoading();
           
        });
        //End
    });
	
	</script>
 
</asp:Content>

